<template>
  <div class="share">
    <el-form :inline="true">
      <el-form-item label="店铺名称：">
        <el-input v-model.trim="formData.name" placeholder="请输入" />
      </el-form-item>
      <el-form-item label="行业：">
        <el-select v-model="formData.value" placeholder="请选择行业">
          <el-option
            v-for="item in dataList"
            :key="item.id"
            :label="item.industry_name"
            :value="item.industry_name"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="refer">查询</el-button>
        <el-button @click="reset">重置</el-button>
      </el-form-item>
    </el-form>
    <el-alert
      title="审核店铺，店铺审核通过之后，店铺既可在线上上线运营，品台将正式开始对店铺进行管理"
      type="info"
      show-icon
      :closable="false"
    />
    <el-table style="width: 100%; margin-bottom: 20px;" :data="data">
      <el-table-column label="店铺编号" width="120" prop="id" />
      <el-table-column label="店铺名称" width="120" prop="shop_name" />
      <el-table-column label="店铺行业" width="120" prop="industry_name" />
      <el-table-column label="店铺地址" width="120" prop="addr" />
      <el-table-column label="联系电话" width="120" prop="mobile" />
      <el-table-column label="推广人ID" width="120" prop="userid" />
      <el-table-column label="营销额" prop="hyp" />
      <el-table-column label="操作" width="300">
        <template #default>
          <el-button type="text">详情</el-button>
          <el-button type="text">查看商品</el-button>
          <el-button type="text">经营分析</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :current-page="page.page"
      :page-sizes="[2, 5, 10, 20]"
      :page-size="page.pagesize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="page.total"
      @current-change="changePage"
      @size-change="sizeChange"
    />
  </div>
</template>
<script>
import { dataList } from '@/api/shop/trade'
import { referData, date, getOrder, getData } from '@/api/businessArea/share'
export default {
  data() {
    return {
      formData: {
        name: '',
        value: ''
      },
      page: {
        page: 1,
        pagesize: 10,
        total: 0
      },
      data: {
        shop_name: '',
        industry_name: '',
        addr: '',
        mobile: '',
        userid: '',
        hyp: '',
        zzq: 0
      },
      dataList: [],
      allmoney: [],
      money: []
    }
  },
  created() {
    this.pathDate()
  },
  methods: {
    async pathDate() {
      const att = await getData()
      this.page.total = att.total
      const res = await dataList()
      this.dataList = res.data
      // 商铺列表数据
      const { data: data } = await date(this.page)
      // 订单列表数据
      const { data: ddd } = await getOrder()
      for (let i = 0; i < data.length; i++) {
        // 为每个商铺添加一个hyp对象用于保存销售额
        data[i].hyp = 0
        data[i].zzq = 0

        for (let j = 0; j < ddd.length; j++) {
          if (data[i].id === ddd[j].shop_id) {
            data[i].hyp += parseInt(ddd[j].ordr_amt)
          }
        }
      }
      this.data = data
      console.log(this.data)
      console.log(8888 + '5656')
    },
    changePage(newPage) {
      this.page.page = newPage
      this.formData = {
        name: '',
        value: ''
      }
      this.pathDate()
    },
    sizeChange(size) {
      this.page.pagesize = size
      this.formData = {
        name: '',
        value: ''
      }
      this.pathDate()
    },
    reset() {
      this.formData = {
        name: '',
        value: ''
      }
      this.refer()
    },
    async refer() {
      const { data: data } = await referData(this.formData)
      // 订单列表数据
      const { data: ddd } = await getOrder()
      for (let i = 0; i < data.length; i++) {
        // 为每个商铺添加一个hyp对象用于保存销售额
        data[i].hyp = 0
        for (let j = 0; j < ddd.length; j++) {
          if (data[i].id === ddd[j].shop_id) {
            data[i].hyp += ddd[j].ordr_amt
            if (ddd[j].ordr_amt > 0) {
              data[i].zzq++
            }
          }
        }
      }
      this.data = data
      console.log(this.date)
    }
    // async getData() {
    //
    //
    //   const res = await date(this.page)
    // await this.getMoney(res.data)
    //   this.allmoney.forEach(item=>{
    //     if(item.length>=1){
    //       var k = 0
    //       for(var i = 0;i<item.length;i++){
    //         k+=item[i].ordr_amt
    //       }
    //       this.money.push(k)
    //     }else{
    //       this.money.push(0)
    //     }
    //   })
    //
    // this.dataList = data
    // var i = 0
    // res.data.forEach((item) => {
    //   item.index = i++
    // })
    // res.data.forEach((value) => {
    //   value.money = this.money[value.index]
    // })
    //     this.data = res.data
    // },
    // getMoney(data) {
    //   return new Promise((reslove)=>{
    //     let i = 0;
    //     data.forEach(async (v) => {
    //     const res = await getOrder(v)
    //     this.allmoney.push(res.data)
    //     i++
    //     if(i===data.length){
    //       reslove()
    //     }
    //   })
    //   })

    // }
  }
}
</script>
<style lang="scss">
.share {
  min-width: 1200px;
}
.el-alert--info.is-light {
  background-color: #e6f7ff !important;
  border: 1px solid #bae7ff;
  margin: 0 auto;
}
.el-icon-info:before {
  content: '\e7a1';
  color: #078fea;
}

.el-alert__icon.is-big {
  font-size: 16px;
  padding-left: 10px;
}
.el-alert .el-alert__description {
  margin: 0;
}
.el-button--text {
  margin-left: 5px;
}
</style>

